<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>{$title}</title>
<include file='web/common:source'/>
<style>
div.layui-layer-shade{background-color:rgba(255,255,255,0) !important;}
div.layui-layer-rim{border:none; box-shadow:3px 5px 6px #dadada,-3px -1px 6px #dadada;}
div.layui-layer-title{background-color:#e2e5e8;}
</style>
</head>
<body ng-app="myApp" ng-controller="myAppControl">
<div class="mainBox m o">
    <div class="mainRight fr" style="padding-bottom:0px;">
        <include file='web/common:header'/>
        <div class="mainRightBot pr o">        
            <!-- leftMenu start -->
            <include file='web/common:left'/>
            <!-- leftMenu end -->
            <div class="rightBox fr" style="width:940px; min-height:900px;">
                <!-- rightBoxTop start -->
                <include file='web/project:common'/>
                <!-- rightBoxTop end -->              
                <!-- 项目详情 -->
                <div class="rightBoxBot">
                	<div class="rightBoxBotTop o afl">
						<a href="{:U('Project/index')}">返回上一级</a>
						<a href="{:U('Project/index')}" class="ts300">项目列表</a>
						<a class="lt"><i class="layui-icon" style="font-size: 16px;">&#xe602;</i></a>
						<a href="javascript:;" class="ts300">项目详情</a>
                	</div>
                    <div class="xiangmudetailsMid m o abofl">
                        <a href="JavaScript:;" class="editContent" onclick="editXiangmu()">修改内容</a>
                        <a href="JavaScript:;" class="delProject" ng-click="delProject(<?PHP echo $_GET['id'];?>)">删除项目</a>
                    </div>
                    <style type="text/css">
                    div.xiangmuShareMid{padding:20px 0px 20px;}
                    div.xiangmuShareMid div.jifenSet{right:0px;}
                    div.xiangmuShareMid div.jifenSet a{display:block; height:30px; background:#fff; color:#3296FA; font-size:16px; padding-bottom:10px; padding-right:0px; text-align:left;}
                    div.xiangmuShareMid div.jifenSet a:hover{margin-right:0px;}
                    </style>
                    <div class="ziyuanMid xiangmuShareMid m ab pr">
                        <a href="{:U('Project/attachment',array('id'=>$_GET['id']))}" class="hetong ts300">查看共享资源<i class="layui-icon" style="font-size: 16px;">&#xe602;</i></a>
                        <div class="jifenSet part">
                            <a href="{:U('Project/points',array('project_id'=>$data['id'],'type'=>0))}">预计积分分配</a>
                            <a href="{:U('Project/points',array('project_id'=>$data['id'],'type'=>1))}">实际积分分配</a>
                        </div>
                    </div>
                	<div class="rightBoxBotBot">
                		<table class="layui-table">
							<colgroup>
								<col width="160">
                                <col width="260">
								<col width="160">
							</colgroup>							
							<tbody>
								<tr>
									<td class="fw">项目名称：</td>
									<td colspan="3">{$data.name}</td>
								</tr>
								<tr>
                                    <td class="fw">项目地点：</td>
                                    <td colspan="3">{$data.detail_address}</td>
                                </tr>
                                <tr>
                                    <td class="fw">项目金额(元)：</td>
                                    <td colspan="3">{$data.amount}元</td>
                                </tr>
                                <tr>
                                    <td class="fw">计划开工日期：</td>
                                    <td colspan="3">{$data.begin_time}</td>
                                </tr>
                                <tr>
                                    <td class="fw">计划竣工日期：</td>
                                    <td colspan="3">{$data.end_time}</td>
                                </tr>
                                <tr>
                                    <td class="fw" style="vertical-align: top;">项目内容：</td>
                                    <td colspan="3"><div style="min-height:80px;">{$data.content}</div></td>
                                </tr>
							</tbody>
						</table>
                	</div> 
                    <ul class="hetongAdd" style="padding-bottom:50px;">
                        <li><span class="title">关联项目负责人：</span><span>{$data.manager}</span></li>                    
                        <li><span class="title renyuanSpan">项目组织架构：</span><a href="javascript:;" onclick="selectPerson()" class="reyuanList">项目人员列表<i class="layui-icon">&#xe602;</i></a></li>
                        <style type="text/css">
                        div.jingduListBox{max-height:112px; overflow:hidden; padding-bottom:15px;}
                        dl.jingduList{width:690px; margin:0px auto; font-size:16px; line-height: 30px; color:#959595;}
                        dl.jingduList dd{padding-left:175px; font-size:16px;}
                        div.jingduList a.jingduList{display:block; width:90px; margin:0px auto; color:#3296fa;}
                        </style>
                        <li>
                            <!-- 0-进行中，1-已结束，2-已删除 status -->
                            <span class="title fl ib">项目进度：</span>
                            <a href="javascript:;" style="padding-left:16px;" ng-click="addJindu()" class="projectEdit">+添加项目进度</a>
                        </li>                        
                        <div class="jingduList">
                            <div class="jingduListBox" ng-style="autoStyle">
                                <foreach name="data['schedules']" item="x">
                                <dl class="jingduList pr">
                                    <dt class="palt">{$x.updated_at}</dt>
                                    <dd>{$x.schedule}</dd>
                                </dl>
                                </foreach> 
                            </div> 
                            <a href="JavaScript:;" ng-click="moreJindu()" class="jingduList pr">加载更多 <img src="__ROOT__/static/web/images/img44.png" class="part" style="top:6px;" alt=""></a>
                        </div>
                    </ul>                    
                </div>
                <!-- 新建订单 弹出层 start -->
                <include file='web/common:createDingdan'/>
                <!-- 新建订单 弹出层 end -->
                <!-- 新建项目 弹出层 新建项目 start -->
                <include file='web/common:createProject'/>
                <!-- 新建项目 弹出层 end -->
                <!-- 新建合同 弹出层 start -->
                <include file='web/common:createHetong'/>
                <!-- 新建合同 弹出层 end -->
                <!-- 修改项目 弹出层 start -->
                <include file='web/common:editProject'/>
                <!-- 修改项目 弹出层 end -->
                <!-- 项目人员列表 弹出层 start -->
                <div id="shadowBox" class="o dn">
                    <div class="w120 o">
                        <div class="shadowBoxLeft fl">
                            <div class="shadowBoxLeftBox m">
                                <div class="comSerch">
                                    <input type="text" class="text palt" placeholder="搜索姓名" ng-model="curPersonSearch">
                                    <input type="button" class="btn part">
                                </div>
                                <div class="noPerson dn"></div>
                                <div class="projectPerson">
                                    <dl ng-repeat="x in curProjectPerson | filter:curSerchStr" class="projectPerson pr">
                                        <dt class="palt" ng-hide="{{x.avatar | showFace }}" style="top:25px;">{{x.name | nameStr}}</dt>
                                        <dt class="palt face" ng-show="{{x.avatar | showFace }}" style="top:25px;"><img ng-src="{{x.avatar}}" alt="" ></dt>
                                        <dd class="fl">
                                            <h3 class="f100">{{x.name}}</h3>
                                            <h4 class="f100"><span class="bumeng">部门：{{x.department}}</span><span class="zhiwei">&nbsp;&nbsp;&nbsp;&nbsp;职位：{{x.position}}</span></h4>
                                            <h4 class="f100"><span class="bumeng">角色：{{x.department}}</span></h4>
                                            <h5 class="f100 addJob cp" ng-click="addRemark(x.id)" ng-hide="{{x.remark | showComment}}">+添加备注</h5>
                                            <h4 class="f100 o" ng-show="{{x.remark | showComment}}">
                                                <span class="bumeng danrenzhiwei fl">备注：{{x.remark}}</span>
                                                <a href="JavaScript:;" class="aEdit fl" ng-click="editRemake(x.id,x.remark)">修改</a>
                                                <!-- <a class="line fl">|</a>
                                                <a href="JavaScript:;" class="aDel fl">删除</a> -->
                                            </h4>  
                                        </dd>
                                        <dd class="part tc">
                                            <h3 class="f100">{{x.mobile}}</h3>
                                            <a href="JavaScript:;" ng-click="delProjectPerson(x.id)" class="b m delPerson"></a>
                                        </dd>
                                    </dl>                                 
                                </div>
                            </div>
                        </div>
                        <div class="shadowBoxRight fl">
                            <div class="shadowBoxRightBox m">
                                <div class="comSerch">                                    
                                    <input type="text" class="text palt" ng-model="allSerchStr" placeholder="姓名/手机号">                                    
                                    <input type="button" class="btn part">
                                </div>
                                <div class="projectPersonRight">
                                    <div class="projectPersonRightBox">
                                        <dl ng-repeat="x in allPerson | filter:searchStr" class="projectPersonRight o pr">
                                            <dt class="palt face" ng-show="{{x.avatar | showFace }}"><img src="__ROOT__/static/web/images/img42.png" alt=""></dt>
                                            <dt class="palt" ng-hide="{{x.avatar | showFace }}">{{x.name | nameStr}}</dt>
                                            <dd class="fr">
                                                <h3 class="f100">{{x.name}}</h3>
                                                <h4 class="f100">部门：{{x.department}}</h4>
                                                <h4 class="f100">职位：{{x.position}}</h4>
                                                <h5 class="f100 tel part">{{x.mobile}}</h5>
                                                <a class="dn">{{x.id}}</a>
                                                <a href="javascript:;" ng-click="addPerson(x.id)" class="parb addPerson">+添加</a>
                                            </dd>
                                        </dl>                                        
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <!-- 项目人员列表 弹出层 end -->
            </div>
        </div>
    </div>
</div>
</body>
<include file='web/common:footer'/>
<script type="text/javascript">
// angular start
(function(){
    var hostUrl = "http://"+"<?php echo $_SERVER['HTTP_HOST']; ?>/";
    var getCurProjectUserList = hostUrl+"project/getMember"; // 获取当前项目的成员
    var addProjectMember = hostUrl+"project/addMember"; // 添加项目成员 
    var delProjectMember = hostUrl+"project/deletemember"; // 刪除项目成员
    var addRemarkUrl = hostUrl+"project/updateMember"; // 添加备注
    var addScheduleUrl = hostUrl+"project/addSchedule"; // 添加项目进度 
    var deleteProjectUrl = hostUrl+"project/delete"; // 删除项目  
    var getUserList = hostUrl+"user/getlist"; // 获取所有人的列表    
    var personUrl = "{:U('Project/userlist')}";
    var myApp = angular.module("myApp",[]);
    // 所有人员列表 
    myApp.controller('myAppControl',['$scope','$http',function($scope,$http){
        $scope.allPerson = null;
        $scope.curProjectPerson = null;
        $scope.searchStr = null;
        $scope.allSerchStr = '';
        $scope.curPersonSearch = '';
        $scope.autoStyle = {};
        $scope.$watch('searchStr',function(oStr){
            $scope.searchStr = oStr;
        }); 
        // 获取所有用户的列表
        ajaxGet(getUserList,{not_project_id:<?php echo $_GET['id']?>},function(res){
            $scope.allPerson = res.data.data;
        });
        // 获取到当前项目的成员列表
        ajaxGet(getCurProjectUserList,{project_id:<?php echo $_GET['id']?>},function(res){
            $scope.curProjectPerson = res.data.data;
        });
        // 搜索所有人的
        $scope.searchStr = function(obj){
            if(obj.name.indexOf($scope.allSerchStr) === -1 && obj.mobile.indexOf($scope.allSerchStr)){
                return false;
            };
            return true;
        };
        // 搜索当前项目成员
        $scope.curSerchStr = function(obj){            
            if(obj.name.indexOf($scope.curPersonSearch) === -1){
                return false;
            };
            return true;
        };
        // 添加项目进度
        $scope.addJindu = function(){
            layer.prompt({
                formType: 2,
                value: '',
                title: '添加项目进度',
                area: ['360px', '120px']
            }, function(value, index, elem){
                $.post(addScheduleUrl,{schedule:value,project_id:<?php echo $_GET['id']?>},function(res){
                    if(res.message == "OK"){
                        layer.msg("添加项目进度成功");
                        setTimeout(function(){
                            location.reload();
                        },300);
                    }else{
                        layer.msg(res.message);
                    };                    
                });
                layer.close(index);
            });
        };
        // 加载更多进度
        $scope.moreJindu = function(){
            $scope.autoStyle = {'max-height':'100%'};
        };
        // 删除项目 
        $scope.delProject = function(projectId){
            layer.confirm('确定要删除该项目吗？', function(index){
                $.post(deleteProjectUrl,{id:projectId},function(res){
                    if(res.message == "OK"){
                        layer.msg('删除项目成功');
                        setTimeout(function(){
                            location.href = hostUrl;
                        },500);
                    }else{
                        layer.msg(res.message);
                    }; 
                },'json');
                layer.close(index);
            });
        };
        // 添加项目人员
        $scope.addPerson = function(itemId){
            layer.confirm('确定要添加吗？', function(index){
                $.post(addProjectMember,{project_id:<?php echo $_GET['id']?>,user_id:itemId},function(res){
                    layer.msg(res.message);
                    setTimeout(function(){
                        location.reload();
                    },300);
                },'json');
                layer.close(index);
            });            
        };
        // 删除项目人员
        $scope.delProjectPerson = function(itemId){
            layer.confirm('确定要删除吗？', function(index){
                $.post(delProjectMember,{id:itemId},function(res){
                    if(res.message == "OK" || res.message != "只能删除您的下级成员"){
                        layer.msg('删除成功');
                        setTimeout(function(){
                            location.reload();
                        },500);
                    }else{
                        layer.msg(res.message);
                    }; 
                },'json');
                layer.close(index);
            });   
        };
        // 增加备注
        $scope.addRemark = function(itemId){
            layer.prompt({title:'添加备注',value:' '},function(val,index){
                if(val != ''){                
                    $.post(addRemarkUrl,{id:itemId,remark:val},function(res){ 
                        if(res.message == "OK"){
                            layer.msg('添加备注成功');
                            setTimeout(function(){
                                location.reload();
                            },300);
                        };
                    },'json');
                };
                layer.close(index);               
            });            
        };
        // 修改备注
        $scope.editRemake = function(itemId,remakeMeg){
             layer.prompt({title:'修改备注',value:remakeMeg},function(val,index){
                if(val != remakeMeg){                
                    $.post(addRemarkUrl,{id:itemId,remark:val},function(res){
                        if(res.message == "OK"){
                            layer.msg('修改备注成功');
                            setTimeout(function(){
                                location.reload();
                            },300); 
                        };
                    },'json');
                };
                layer.close(index);               
            });
        };
        function ajaxGet(url,data,fun){
            $http.get(url,{params:data}).then(function(res){
                fun(res);
            });
        };
        function ajaxPost(url,data,fun){
            $http.post(url,{params:data}).then(function(res){
                fun(res);
            });
        };
    }]);
    myApp.filter('showFace', function() { //可以注入依赖
        return function(text) {
            if(text == ""){
                return false;
            }else{
                return true;
            };
        }
    });
    myApp.filter('nameStr',function(){
        return function(nameStr){
            if(nameStr.length>2){
                return nameStr.substr(-2);
            }else{
                return nameStr;
            };
        }
    });
    myApp.filter('showComment',function(){
        return function(comment){
            if(comment == ""){
                return false;
            }else{
                return true;
            };
        }
    });    
})();
// selectPerson();
function selectPerson(){   
    layer.open({
        type: 1,
        title: ['项目人员列表', 'font-size:18px;'],
        skin: 'layui-layer-rim', //加上边框
        area: ['770px', '650px'], //宽高
        content: $("#shadowBox")
    });
};
// $("ul.hetongAdd>li>a.reyuanList").click(function(){
    
// });
</script>
</html>